<template>
	<u-popup :show="show" title="免单" mode="bottom" :round="10" :safeAreaInsetBottom='true' @close="show = false" zoom>
		<view class="f-1 w100 f14 mt20 p-10-20">
			<view class="p-10-0">
				<view class="mr10 left c9"><text class="crb">*</text>原因</view>
				<view class="flex mt10">
					<view class="f-g-1">
						<text v-for="(v,i) in reasonConfig.orderFree" :key="i" class="kj c3 f12" @click="kjcx(v)">{{v}}</text>
					</view>
				</view>
				<view class="f-g-1 mt20">
					<u--textarea placeholder="请输入原因" :customStyl="{background:'#f3f3f3'}" v-model="params.reason">
					</u--textarea>
				</view>
			</view>
			<view class="mt30 mr20">
				<u-button :disabled="!params.reason" text="确认" :color="subColor"
					@click="save" :customStyle="{borderRadius:'60rpx',width:'650rpx',height:'100rpx',color:'#000',fontWeight:'bold'}"></u-button>
			</view>
		</view>
	</u-popup>
</template>

<script>
	import {
		mapState,
	} from 'vuex'
	export default {
		components: {

		},
		props: {
			mode: {
				type: String,
				default: () => 'single'
			},
			v: {
				type: Object,
				default: () => {}
			}
		},
		computed: {
			...mapState({
				reasonConfig: state => state.config.reasonConfig,
			}),
		},
		data() {
			return {
				subColor: uni.getStorageSync('subject_color'),
				form: {},
				params: {
					type: 'discount',
					discount: '',
					reason: '',
				},
				kjsr:[],
				value: 1,
				show: false,
			}
		},
		methods: {
			open(v) {
				if (v) {
					this.form = v
					this.value = this.form.num
				}
				// if (this.params.type == 'discount') this.kjsr = this.reasonConfig && this.reasonConfig.orderDiscount || []
				// this.kjsr = this.reasonConfig && this.reasonConfig.goodsDiscount || []
				this.show = true
			},
			close() {
				this.show = false
			},
			changeType(e) {
				this.params.type = e
			},
			kjcx(v){
				this.params.reason = v
			},
			async save() {
				let {
					data
				} = await this.beg.request({
					url: this.form.orderSn ? `${this.api.orderFree}/${this.form.orderSn}` : this.api
						.checkoutFree,
					method: 'POST',
					data: {
						reason: this.params.reason,
						diningType: this.v.diningType,
						storeId: this.v.storeId,
						tableId: this.v.orderSn && this.v.tableId ? this.v.tableId : this.v.id,
					}
				})
				this.show = false
				this.$emit('save', data)
			},
			svalue(val){
				if(val<0)this.params.discount=1
			},
		}
	}
</script>

<style lang="scss" scoped>
	.left {
		width: 140rpx;
		text-align: left;
	}
	.kj{
		border: 2rpx solid #e7e7e7;
		margin-right: 10rpx;
		padding: 6rpx;
		border-radius: 4rpx;
	}
</style>